<template>
  <div class="page_allUserAuditRecords">
    <van-nav-bar
      title="全部审核记录"
      left-arrow
      @click-left="$router.back()"
    />

    <van-pull-refresh v-model="isLoading" @refresh="onRefreshReq">
      <apply-content-item
        :isDetail="true"
        :itemObj="this.$route.query"
      ></apply-content-item>
      <van-divider
        :style="{ color: '#323233', borderColor: '#BCBCBC',
              padding: '2px 30px 2px 30px' , marginTop: '10px',
              backgroundColor: '#FFFFFF', fontWeight: 'bolder'
            }"
      >
        已审核的(全部)记录
      </van-divider>

      <van-tabs v-model="activeVanTab" v-if="reviewStockList.length || Object.keys(groupAuditResult).length" sticky >
        <van-tab title="集团（后台）最终审核">
          <review-content-item
            :auditObj="groupAuditResult"
            :isGroupAudit="true"
            v-show="Object.keys(groupAuditResult).length"
          ></review-content-item>

          <van-divider
            style="margin-top: 60px"
            v-show="!Object.keys(groupAuditResult).length"
          >集团（后台）暂时没有审核完成
          </van-divider>
        </van-tab>
        <van-tab title="其他人审核">
          <div v-for="item in reviewStockList" :key="item.id">
            <review-content-item
              :auditObj="item"
            ></review-content-item>
          </div>
          <van-pagination v-model="initParamObj.pageIndex"
                          :total-items="totalRecords"
                          :show-page-size="5"
                          force-ellipses
                          @change="handlePaginationChange"
          >
            <template #prev-text>
              <van-icon name="arrow-left" />
            </template>
            <template #next-text>
              <van-icon name="arrow" />
            </template>
            <template #page="{ text }">{{ text }}</template>
          </van-pagination>
        </van-tab>
      </van-tabs>
      <van-divider style="margin-top: 80px" v-else>暂无记录</van-divider>
    </van-pull-refresh>

  </div>
</template>

<script>
import applyContentItem from "./components/applyContentItem";
import reviewContentItem from "./components/reviewContentItem";
import { Toast } from "vant";
export default {
  name: "allUserAuditRecords",
  components: {
    applyContentItem,
    reviewContentItem,
  },
  data(){
    return {
      isLoading: false,
      activeVanTab: 0,
      initParamObj: {
        pageIndex: 1,
        // 请求每页的数量
        pageSize: 10,
        applyid: this.$route.query.id || '',
        stockid: this.$route.query.stockid || '',
      },
      reviewStockList: [],
      groupAuditResult: {},
      totalRecords: 0,
    }
  },

  created() {

  },

  mounted() {
    // const { ...paramObj } = this.initParamObj;
    this._initPageData(this.initParamObj);
  },

  methods: {
    async _initPageData(paramObj, isRefresh = false){
      const resp = await this.$api.stock.reqReviewStockList(paramObj);
      if (resp.code === 200) {
        this.reviewStockList = resp.data.items || []
        this.totalRecords = resp.data.total || 0;
        this.groupAuditResult =  resp.data.backinfo || {};
        if (isRefresh){
          Toast('刷新成功');
          this.isLoading = false;
        }

      }
    },

    handlePaginationChange(pageIndex){
      const param = {
        ...this.initParamObj,
        pageIndex,
      }
      this._initPageData(param);
    },

    onRefreshReq(){
      this.initParamObj.pageIndex = 1
      this._initPageData(this.initParamObj, true);
    },
  }
};
</script>

<style lang="scss" scoped>
.page_allUserAuditRecords{
  width: 100%;
}
</style>
